import { NodeSize } from '../config'

export default function denormaliser(flow) {
  flow.register('Denormaliser', ({ PolygonNode, PolygonNodeModel, h }) => {
    class Node extends PolygonNode {
      getIconShape() {
        return h(
          'svg',
          {
            width: NodeSize,
            height: NodeSize,
            viewBox: '0 0 1024 1024'
          },
          h(
            'path',
            {
              fill: '#3D6480',
              d: 'M491.593143 105.155048v180.175238H947.931429v-180.175238H491.593143z m414.890667 138.752H533.040762V146.602667H906.48381v97.304381z'
            }
          ),
          h(
            'path',
            {
              fill: '#0CB20F',
              d: 'M645.290667 525.385143l32.768 32.768 47.640381-47.616v110.494476a84.358095 84.358095 0 0 1-84.236191 84.260571h-15.579428v46.32381h15.579428a130.730667 130.730667 0 0 0 130.56-130.584381V510.537143l47.640381 47.616 32.768-32.768-103.570286-103.545905-103.570285 103.545905z'
            }
          ),
          h(
            'path',
            {
              fill: '#3D6480',
              d: 'M403.748571 578.340571h62.512762v40.618667H403.748571zM229.961143 578.340571h62.488381v40.618667H229.961143zM143.067429 578.340571h62.488381v40.618667H143.067429zM316.830476 578.340571h62.512762v40.618667h-62.512762zM491.593143 643.34019h41.447619v59.806477h-41.447619zM118.686476 578.340571h-2.267428v-0.170666h-41.447619v40.789333h43.715047zM74.971429 643.34019h41.447619v59.806477h-41.447619zM403.748571 872.984381h62.512762v41.423238H403.748571zM143.067429 872.984381h62.488381v41.423238H143.067429zM74.971429 792.088381h41.447619V848.457143h-41.447619zM491.593143 872.984381h-0.950857v41.423238h42.398476V872.838095h-41.447619zM116.419048 872.984381V872.838095h-41.447619v41.569524h43.715047v-41.423238zM316.830476 727.527619h62.512762v40.17981h-62.512762zM229.961143 727.527619h62.488381v40.17981H229.961143zM403.748571 727.527619h62.512762v40.17981H403.748571zM491.593143 792.088381h41.447619V848.457143h-41.447619zM316.830476 872.984381h62.512762v41.423238h-62.512762zM229.961143 872.984381h62.488381v41.423238H229.961143zM490.642286 727.527619v40.17981h42.398476V727.527619zM143.067429 727.527619h62.488381v40.17981H143.067429zM118.686476 727.527619H74.971429V767.707429h43.715047zM491.593143 473.6v0.073143h41.447619v-41.496381h-42.398476v41.423238zM403.748571 432.176762h62.512762v41.423238H403.748571zM316.830476 432.176762h62.512762v41.423238h-62.512762zM491.593143 498.054095h41.447619v55.734857h-41.447619zM491.593143 578.340571h-0.950857v40.618667h42.398476V578.169905h-41.447619zM74.971429 498.054095h41.447619v55.734857h-41.447619zM116.419048 473.6h2.267428v-41.423238H74.971429v41.496381h41.447619zM143.067429 432.176762h62.488381v41.423238H143.067429zM229.961143 432.176762h62.488381v41.423238H229.961143z'
            }
          )
        )
      }

      getLabelShape() {
        return h(
          'text',
          {
            fill: '#000000',
            fontSize: 12,
            x: NodeSize / 2,
            y: NodeSize + 20,
            textAnchor: 'middle',
            dominantBaseline: 'middle'
          },
          '列转行'
        )
      }

      getShape() {
        const { x, y, width, height } = this.getAttributes()
        const transform = `matrix(1 0 0 1 ${x - width / 2} ${y - height / 2})`
        return h(
          'g',
          {
            transform
          },
          [
            h(
              'rect',
              {
                rx: 5,
                ry: 5,
                width: NodeSize,
                height: NodeSize,
                fill: '#fff',
                stroke: '#3D6380',
                strokeWidth: 1
              }
            ),
            this.getIconShape(),
            this.getLabelShape()
          ]
        )
      }
    }
    class Model extends PolygonNodeModel {
      constructor(data, graphModel) {
        super(data, graphModel)
        this.points = [
          [NodeSize / 2, 0],
          [NodeSize, NodeSize / 2],
          [NodeSize / 2, NodeSize],
          [0, NodeSize / 2]
        ]
      }
    }

    return {
      view: Node,
      model: Model
    }
  })
}
